<template>
  <el-dialog
    title="内容跨域数据详情"
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
    width="60%"
    >
     <el-form :model='dialogForm' class='demo-form-inline2' size='small' :disabled="true" label-width="100px">
      <el-form-item label='入库时间'>
        <el-date-picker
          v-model="dialogForm.timestamp"
          type="datetime"
          style="width:100%"
          placeholder="选择日期时间">
        </el-date-picker>
      </el-form-item>
      <el-form-item label='主叫端口号'>
        <el-input v-model="dialogForm.port" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='被叫号码'>
        <el-input v-model="dialogForm.dstAddr" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='行业类别'>
        <el-select v-model="dialogForm.industryType" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label='跨域行业类别'>
        <el-select v-model="dialogForm.crossIndustryType" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label=''>
      </el-form-item>
      <el-form-item label='短信内容' style="width:100%">
        <el-input
          type="textarea"
          :rows="2"
          placeholder=""
          v-model="dialogForm.smContent">
        </el-input>
      </el-form-item>
      <el-form-item label='命中次数'>
        <el-input v-model="dialogForm.hitCnt" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='基础接入号'>
        <el-input v-model="dialogForm.svcId" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='所属地市'>
        <el-input v-model="dialogForm.proName" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='所属区县'>
        <el-input v-model="dialogForm.townName" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='企业名称'>
        <el-input v-model="dialogForm.encName" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='客户编码'>
        <el-input v-model="dialogForm.clientCode" placeholder=""></el-input>
      </el-form-item>
      <el-form-item label='客户级别'>
        <el-select v-model="dialogForm.customerLevel" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label='产品名称'>
        <el-select v-model="dialogForm.productName" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label='端口状态'>
        <el-select v-model="dialogForm.portStatus" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label='端口健康级别'>
        <el-select v-model="dialogForm.healthLevel" placeholder="请选择" style="width:100%">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      options: [
        {
          value: '选项1',
          label: '参数1'
        },
        {
          value: '选项2',
          label: '参树2'
        },
        {
          value: '选项3',
          label: '参数3'
        },
        {
          value: '选项4',
          label: '参数4'
        },
        {
          value: '选项5',
          label: '参数5'
        }
      ],
      typeOptions: [
        {
          value: '1',
          label: '时间'
        },
        {
          value: '2',
          label: '类型'
        }
      ],
      dialogForm: {
        timestamp: '',
        port: '',
        dstAddr: '',
        industryType: '',
        crossIndustryType: '',
        smContent: '',
        hitCnt: '',
        encName: '',
        svcId: '',
        clientCode: '',
        customerLevel: '',
        proName: '',
        townName: '',
        portStatus: '',
        healthLevel: '',
        productName: ''
      }
    }
  },
  methods: {
    init(data) {
      this.dialogVisible = true
      this.dialogForm = {...data}
    }
  }
}
</script>